<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>代理商客户管理</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <!--引入本地的css样式-->
  <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../static/css/admin.css" media="all">

</head>
<body>

  <div class="layui-fluid">   
    <div class="layui-card">
      <div class="layui-form layui-card-header layuiadmin-card-header-auto">
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">客户名称</label>
            <div class="layui-input-block">
              <input type="text" id="customer_name" name="customer_name" placeholder="输入客户名称" autocomplete="off" class="layui-input">
            </div>
          </div>
          <div class="layui-inline">
            <button class="layui-btn layuiadmin-btn-admin" id="btn_search" lay-submit lay-filter="LAY-user-back-search">
              <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
            </button>
          </div>
        </div>
      </div>
      
      <div class="layui-card-body">

        <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container">

          <button class="layui-btn layuiadmin-btn-admin" lay-event="add" id="add_employee" data-type="add_employee">添加客户</button>
        </div>
      </script>

        <!--<script type="text/html" id="toolbarDemo">-->
          <!--<div style="padding-bottom: 10px;">-->
            <!--<button class="layui-btn layuiadmin-btn-admin" lay-event="batchdel">删除</button>-->
            <!--<button class="layui-btn layuiadmin-btn-admin" id="add_employee" data-type="add_employee">添加</button>-->
          <!--</div>-->
        <!--</script>-->
        <!--数据表格-->
        <table class="layui-hide" id="LAY-user-back-manage" lay-filter="LAY-user-back-manage"></table>

        <script type="text/html" id="customerStateTpl">
          {{#  if(d.state==1){ }}
          <span>启用</span>
          {{#  } else if(d.state==2){ }}
          <span>停用</span>
          {{#  } }}
        </script>
      <!--  <script type="text/html" id="statusTpl">
          {{#  if(d.status == 1){ }}
          <span>正常</span>
          {{#  } else if(d.status == 2){ }}
          <button type="button" class="layui-btn-xs layui-btn-disabled">冻结</button>
          {{#  } else if(d.status == 3){ }}
          <button type="button" class="layui-btn-xs layui-btn-danger">删除</button>
          {{#  } }}
        </script>-->

        <script type="text/html" id="xuhao">
            {{d.LAY_TABLE_INDEX+1}}
        </script>


        <script type="text/html" id="buttonTpl">
          {{#  if(d.check == true){ }}
            <button class="layui-btn layui-btn-xs">已审核</button>
          {{#  } else { }}
            <button class="layui-btn layui-btn-primary layui-btn-xs">未审核</button>
          {{#  } }}
        </script>

        <script type="text/html" id="table-useradmin-admin">
          <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
          {{#  if(d.role == '超级管理员'){ }}
          <a class="layui-btn layui-btn-disabled layui-btn-xs"><i class="layui-icon layui-icon-delete"></i>删除</a>
          {{#  } else { }}
          <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
          {{#  } }}
        </script>

        <script type="text/html" id="barDemo">
          <a class="layui-btn layui-btn-xs" lay-event="view">查看</a>
          <a class="layui-btn layui-btn-xs" lay-event="edit">修改</a>
          <a class="layui-btn layui-btn-xs" lay-event="open">启用</a>
          <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="stop">停用</a>
        </script>


      </div>
    </div>
  </div>

<script src="../../static/js/jquery-3.6.0.min.js"></script>
<!--引入本地layui.js-->
<script src="../../static/layui/layui.js"></script>
<!--js-->
<script type="text/javascript">
    layui.config({
        base: '../../static/layui/layuiadmin/' //静态资源所在路径js
    }).extend({
        index: 'lib/index' //主入口模块
    }).use('index');
</script>

  <script type="text/javascript">
      layui.use(['table','form'], function(){
          var table = layui.table;
          var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功

          table.render({
              elem: '#LAY-user-back-manage'//绑定到哪一个表格：#id值
              ,url:'/customer/customerTable'//servlet绑定路径
              ,title: '代理商客户数据表'//标题
              ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
              ,cols: [[

//                  {field:'cus_id', title:'id号'}
                  {templet:'#xuhao', title:'序号'}
                  ,{field:'company_name', title:'客户名称'}
                  ,{field:'represent', title:'法人代表'}
                  ,{field:'registration_time', title:'注册时间'}
                  ,{field:'company_type', title:'类型'}
                  ,{field:'state', title:'状态',templet:'#customerStateTpl'}
                  //templet参数：laytpl模板引擎{{d.dept.dept_name}}
                  ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:230 }
              ]]
              ,page: true
              ,limits:[5,10,15,20]
          });

          //搜索点击事件
          $("#btn_search").click(function () {
                var customer_name = $("#customer_name").val();
                //执行重载
                table.reload('LAY-user-back-manage', {
                    url:'/customer/search',
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    ,where: {
                        customer_name: customer_name
                    }
                });
          });

          //监听行工具事件
          table.on('tool(LAY-user-back-manage)', function(obj){
              var data = obj.data;//选中的当前行的数obj
              if(obj.event === 'stop'){
                  layer.confirm('确认停用吗', function(index){
                      //通过ajax实现真正的停用
                      $.ajax({
                          url:"/customer/del",
                          type:"post",
                          data:{id:data.cus_id,state0:data.state},
                          dataType:"json",
                          success:function (res) {
                              if(res.code == 200){
                                  layer.msg(res.msg, {
                                      offset: '15px'
                                      ,icon: 1
                                      ,time: 1000
                                  },function () {
                                      //刷新
                                      window.location.reload();
                                  });
                              }
                              if(res.code == 500){
                                  layer.msg(res.msg, {
                                      offset: '15px'
                                      ,icon: 1
                                      ,time: 1000
                                  },function () {
                                      //刷新
                                      window.location.reload();
                                  });
                              }
                              layer.close(index); //关闭弹层


                          }
                      })

                  });
              } else if(obj.event === 'open'){
                  layer.confirm('确认启用吗', function(index){
                      //通过ajax实现真正的停用
                      $.ajax({
                          url:"/customer/open",
                          type:"post",
                          data:{id:data.cus_id,state0:data.state},
                          dataType:"json",
                          success:function (res) {
                              if(res.code == 200){
                                  layer.msg(res.msg, {
                                      offset: '15px'
                                      ,icon: 1
                                      ,time: 1000
                                  },function () {
                                      //刷新
                                      window.location.reload();
                                  });
                              }
                              if(res.code == 500){
                                  layer.msg(res.msg, {
                                      offset: '15px'
                                      ,icon: 1
                                      ,time: 1000
                                  },function () {
                                      //刷新
                                      window.location.reload();
                                  });
                              }
                              layer.close(index); //关闭弹层


                          }
                      })

                  });
              }else if(obj.event === 'edit'){
                  layer.open({
                      type: 2
                      ,title: '编辑客户信息'
                      ,id:'editcustomer'
                      ,content: 'editCustomer.html'
                      ,area: ['700px','700px']
                      ,maxmin:true
                      ,btn: ['确定', '取消']
                      ,yes: function(index, layero){
                          var body = layer.getChildFrame('body', index);
                          var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                          var submitData = body.find('#myform').serialize();
                          //提交 Ajax 成功后，静态表单中的数据
                          $.ajax({
                              url:"/customer/update",
                              type:"post",
                              data:submitData,
                              dataType:"json",
                              success:function (res) {
                                  if(res.code == 200){
                                      layer.msg(res.msg, {
                                          offset: '15px'
                                          ,icon: 1
                                          ,time: 1000
                                      },function () {
                                          //刷新
                                          window.location.reload();
                                      });
                                  }
                                  if(res.code == 500){
                                      layer.msg(res.msg, {
                                          offset: '15px'
                                          ,icon: 1
                                          ,time: 1000
                                      },function () {
                                          //刷新
                                          window.location.reload();
                                      });
                                  }
                                  layer.close(index); //关闭弹层

                              }
                          })

                      }
                      ,success: function (layero, index) {//点击弹出框时，执行的函数。
                          var iframe=window['layui-layer-iframe'+index];
                          iframe.child(data);
                          //获取弹出编辑框的body内容
                          var body = layer.getChildFrame('body', index);
                          body.find("input[name=cus_id]").val(data.cus_id);
                          //找到body中input输入框，向customer_name输入框中塞入选中行的值
                          body.find("input[name=cus_id]").val(data.cus_id);
                          body.find("input[name=company_name]").val(data.company_name);
                          body.find("input[name=company_home]").val(data.company_home);
                          body.find("input[name=represent]").val(data.represent);
                          body.find("input[name=registration_time]").val(data.registration_time);

                          body.find("input[name=document_num]").val(data.document_num);
                          body.find("input[name=country]").val(data.country);
                          body.find("input[name=provinces]").val(data.provinces);
                          body.find("input[name=city]").val(data.city);
                          body.find("input[name=area]").val(data.area);
                          body.find("input[name=company_fax]").val(data.company_fax);
                          body.find("input[name=company_tel]").val(data.company_tel);
                          body.find("input[name=company_address]").val(data.company_address);
                          body.find("textarea[name=note]").val(data.note);

                          body.find("input[name=con_name]").val(data.con_name);
                          body.find("input[name=con_tel]").val(data.con_tel);
                          body.find("input[name=con_fax]").val(data.con_fax);
                          body.find("input[name=con_email]").val(data.con_email);
                          body.find("input[name=con_duties]").val(data.con_duties);
                          body.find("input[name=con_agent_id]").val(data.con_agent_id);






                      }
                  });
              }else if(obj.event === 'view'){
                  layer.open({
                      type: 2
                      ,title: '查看客户信息'
                      ,content: 'viewCustomer.html'
                      ,area: ['700px','700px']
                      ,maxmin:true
                      ,yes: function(index, layero){
                          layero.close(index);

                      }
                      ,success: function (layero, index) {//点击弹出框时，执行的函数。
                          //获取弹出编辑框的body内容
                          var body = layer.getChildFrame('body', index);
                          body.find("input[name=cus_id]").val(data.cus_id);
                          //找到body中input输入框，向customer_name输入框中塞入选中行的值
                          body.find("input[name=cus_id]").val(data.cus_id);
                          body.find("input[name=company_name]").val(data.company_name);
                          body.find("input[name=company_home]").val(data.company_home);
                          body.find("input[name=company_type]").val(data.company_type);
                          body.find("input[name=state]").val(data.state);
                          body.find("input[name=represent]").val(data.represent);
                          body.find("input[name=registration_time]").val(data.registration_time);
                          body.find("input[name=document_type]").val(data.document_type);
                          body.find("input[name=document_num]").val(data.document_num);
                          body.find("input[name=country]").val(data.country);
                          body.find("input[name=provinces]").val(data.provinces);
                          body.find("input[name=city]").val(data.city);
                          body.find("input[name=area]").val(data.area);
                          body.find("input[name=company_fax]").val(data.company_fax);
                          body.find("input[name=company_tel]").val(data.company_tel);
                          body.find("input[name=company_address]").val(data.company_address);
                          body.find("textarea[name=note]").val(data.note);


                          body.find("input[name=con_name]").val(data.con_name);
                          body.find("input[name=con_tel]").val(data.con_tel);
                          body.find("input[name=con_fax]").val(data.con_fax);
                          body.find("input[name=con_email]").val(data.con_email);
                          body.find("input[name=con_duties]").val(data.con_duties);
                          body.find("input[name=con_agent_id]").val(data.con_agent_id);


                      }
                  });
              }
          });

          //头工具栏事件
          table.on('toolbar(LAY-user-back-manage)', function(obj){
              var checkStatus = table.checkStatus(obj.config.id);
              switch(obj.event){

                  case 'add':
                      layer.open({
                          type: 2
                          ,title: '添加客户'
                          ,id:'addcustomer'
                          ,content:'addCustomer.html'
                          ,area: ['700px','700px']
                          ,maxmin:true
                          ,btn: ['确定', '取消']
                          ,success:function(index, layero) {
//                                  layero.addClass('layui-form');
                                  layero.find('.layui-layer-btn0').attr({
                                      'lay-filter':'addcustomer',
                                      'lay-submit':''
                                  });
                                  form.render();
                              }
                          ,success:function (layero,index) {
                              layero.addClass('layui-form');
                              layero.find('.layui-layer-btn0').attr('lay-filter','fromVerify').attr('lay-submit','');
                              form.render();
                          }
                          ,yes: function(index, layero){

                              var body = layer.getChildFrame('body', index);
                              var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                              var submitData = body.find('#myform').serialize();//把add.html中表单中所有参数通过Ajax的data:submitData传递给服务器端
                                  //提交 Ajax 成功后，静态表单中的数据
                                  $.ajax({
                                      url: "/addCustomer",
                                      type: "post",
                                      data: submitData,//所有表单中参数值
                                      dataType: "json",
                                      success: function (res) {
                                          if (res.code == 200) {
                                              layer.msg(res.msg, {
                                                  offset: '15px'
                                                  , icon: 1
                                                  , time: 1000
                                              }, function () {
                                                  //刷新
                                                  window.location.reload();
                                              });
                                          }
                                          if (res.code == 500) {
                                              layer.msg(res.msg, {
                                                  offset: '15px'
                                                  , icon: 1
                                                  , time: 1000
                                              }, function () {
                                                  //刷新
                                                  window.location.reload();
                                              });
                                          }
                                          layer.close(index); //关闭弹层

                                      }
                                  })



//                      var iframeWindow = window['layui-layer-iframe'+ index]
//                          ,submitID = 'LAY-user-back-submit'
//                          ,submit = layero.find('iframe').contents().find('#'+ submitID);
//                      //监听提交
//                      iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
//                          var field = data.field; //获取提交的字段
//                          alert("ok");
//                          console.log(field);
//
//
//                          table.reload('LAY-user-front-submit'); //数据刷新
//                          layer.close(index); //关闭弹层
//                      });

//                      submit.trigger('click');
                          }
                      });
                      break;
                  //自定义头工具栏右侧图标 - 提示
                  case 'LAYTABLE_TIPS':
                      layer.alert('这是工具栏右侧自定义的一个图标按钮');
                      break;
              };
          });


      });
  </script>



</body>
</html>

